@extends("admin.framework.layouts.main")
@push('styles')
    <style>
        .Va-container-content{
            height: 72vw;
        }
    </style>
@endpush
@section("content")
    <div class="form-container">
        <el-row :gutter="24" justify="start" type="flex">
            <el-col :xs="24" :sm="18" :md="16" :lg="14" :xl="12" :push="4">
                <el-form ref="formsModel" :model="formsModel" label-position="right" label-width="140px" size="medium" class="Va-forms" data-7512a93d>

                    <div data="分隔栏" style="margin-top: 20px;color: #ccc"><span>基本信息</span><el-divider></el-divider></div>

                    <el-form-item label="accessKeyId" prop="accessKeyId" class="float-clear">
                        <el-input v-model="formsModel.accessKeyId" placeholder="请填写accessKeyId" maxlength="55"></el-input>
                    </el-form-item>

                    <el-form-item label="accessSecret" prop="accessSecret" class="float-clear">
                        <el-input v-model="formsModel.accessSecret" placeholder="请填写accessSecret" maxlength="55"></el-input>
                    </el-form-item>

                    <el-form-item label="短信签名" prop="signName" class="float-clear">
                        <el-input v-model="formsModel.signName" placeholder="请填写短信签名" maxlength="55"></el-input>
                    </el-form-item>

                    {{--                    <div data="分隔栏" style="margin-top: 20px;color: #ccc"><span>接口配置信息</span><el-divider></el-divider></div>--}}

                    {{--                    <el-form-item label="URL" prop="url" class="float-clear">--}}
                    {{--                        <el-input v-model="formsModel.url" placeholder="请填写URL" maxlength="600">--}}
                    {{--                            <template slot="prepend">https://</template>--}}
                    {{--                            <template slot="append">/api/wx/getWeChatMsg</template>--}}
                    {{--                        </el-input>--}}
                    {{--                    </el-form-item>--}}

                    {{--                    <el-form-item label="Token" prop="token" class="float-clear">--}}
                    {{--                        <el-input v-model="formsModel.token" placeholder="请填写Token" maxlength="55"></el-input>--}}
                    {{--                    </el-form-item>--}}

                    <el-form-item class="forms-fixed-bottom">
                        <div class="Va-text-left" data-7512a93d>
                            <el-button class="Va-button" type="primary" size="medium"  @click="formsModelSubmit" :loading="config.loading" :disabled="config.disabled">
                                @{{config.loading ? '提交中...' : '提 交'}}
                            </el-button>
                            <el-button class="Va-button" @click="redirectPage('framework/setup/page/ali_config')" type="default" size="medium">刷 新</el-button>
                        </div>
                    </el-form-item>
                </el-form>
            </el-col>
        </el-row>
    </div>
@endsection
{{--  扩展页面  --}}
@section("page")
@endsection
@push('scripts')
    <script>
        var $App = new Vue({
            el: '#app',
            mixins: [$Config,$Layouts],
            data: {
                config:{activeTabs:'1', permissions:false, menu_id:0,loading:false,view_loading:true,__table:'ALiConfig'},
                formsModel:{},
            },
            methods:{
                formsModelSubmit()
                {
                    var that = this;
                    that.config.loading = true;
                    that.$refs['formsModel'].validate(function (valid) {
                        if (valid) {
                            that.formsModel.__table = that.config.__table;
                            $Request.postJson('framework/setup/pageUpdateSetup', that.formsModel, function (res) {
                                if(res.code === 200){
                                    that.$Message(res.message, function () {
                                        that.getFormsModule();
                                    });
                                } else {
                                    that.config.loading = false;
                                    that.$Message(res.message, 'warning');
                                }
                            })
                        } else {
                            that.config.loading = false;
                        }
                    });
                },

                getFormsModule()
                {
                    var that = this;

                    $Request.postJson('framework/setup/pageGetSetup', {__table: that.config.__table}, function (res) {
                        if(res.code === 200){
                            if(res.result && !Array.isArray(res.result)) {
                                that.formsModel = res.result;
                            }
                        }
                        that.config.view_loading = false;
                        that.config.loading = false;
                    })
                }
            },
            mounted(){
                this.getFormsModule();
            },
            created() {

            },
        })
    </script>
@endpush